import React from 'react';

export default function ShoppingCartBody({ goods, addCartList }) {
    return <div className="wind-cart-body">
        {
            goods.map(data => {
                return <WindGoods
                    key={data.id}
                    name={data.title}
                    price={data.price}
                    id={data.id}
                    addCartList={addCartList}
                ></WindGoods>
            })
        }
    </div>
}

function WindGoods({ name, price, id, addCartList }) {
    const handleClick = (e) => {
        const id = e.target.dataset.id;
        addCartList(id)
    }
    return <div className="wind-goods-wrap">
        <div className="wind-goods-img"></div>
        <div className="wind-goods-info">
            <div className="goods-name" title={name}>{name}</div>
            <div className="goods-price">{price}</div>
            <button
                className="goods-add-btn"
                data-id={id}
                onClick={handleClick}
            >加入购物车</button>
        </div>
    </div>
}